<!--需要传递参数 无-->
<!--需要传递方法 无-->
<template>
	<div class="tips" id="tips" style="display: none;">
		<div class="tips-secondary">
			<div class="return" id="tips-close" @click='hideTips'>x</div>
			<div class="prompt"><span>!</span>温馨提示</div>
			<div class="prompt-substance">网页版暂不支持该功能，请用手机下载第一志愿APP使用该功能。</div>
			<ul class="clearfix" id="tips-options">
				<li class="no-download" @click='hideTips'>暂不下载</li>
				<li class="download">
					<a @click="tospacial">下载APP使用</a>
				</li>
			</ul>
		</div>
	</div>
</template>
<script>
	module['base-tips'] = {
		template: template,
		methods: {
			hideTips: function hideTips() {
				document.querySelector('#tips').style.display = 'none';
			},
			tospacial: function tospacial() {
				//主页单独对待
				if (/index\.html/g.test(location.href)) {
					location.href = './view/special.html';
				} else {
					location.href = './special.html';
				}
			}
		}
	};
</script>
<style>
	/*模态框*/
	.tips {
		background-color: rgba(0, 0, 0, .5);
		position: fixed;
		top: 0;
		left:0;
		right:0;
		bottom:0;
		z-index: 5000;
	}
	.tips .tips-secondary {
		width: 500px;
		height: 279px;
		background-color: #ffffff;
		border-radius: 20px;
		position: fixed;
		top: 265px;
		left: 50%;
		margin-left: -250px;
		text-align: center;
	}
	.tips .tips-secondary .return {
		position: absolute;
		top: 5px;
		right: 12px;
		font-size: 30px;
		text-align: center;
		line-height: 27px;
		cursor: pointer;
	}
	.tips .tips-secondary .prompt {
		font-size: 24px;
		color: #333333;
		margin-top: 47px;
	}
	.tips .tips-secondary .prompt span {
		display: inline-block;
		width: 31px;
		height: 31px;
		border-radius: 50%;
		background-color: #fe6a23;
		color: #FFFFFF;
		margin-right: 10px;
	}
	.tips .tips-secondary .prompt-substance {
		width: 350px;
		margin: 0 auto;
		font-size: 14px;
		color: #888888;
		text-align: left;
		margin-top: 33px;
	}
	.tips .tips-secondary ul {
		width: 360px;
		margin: 0 auto;
		margin-top: 37px;
	}
	.tips .tips-secondary ul li {
		width: 167px;
		height: 52px;
		border-radius: 25px;
		border: solid 1px #999999;
		font-size: 20px;
		color: #555555;
		line-height: 52px;
		float: left;
		cursor: pointer;
	}
	.tips .tips-secondary ul .download {
		float: right;
		background-color: #11bdc5;
		color: #FFFFFF;
		border: solid 1px #11bdc5;
	}
	.tips .tips-secondary ul .download a {
		display: inline-block;
		width: 100%;
		height: 100%;
		color: #fff;
	}
</style>